<template>
  <div class="PRDall">
    <div class="PRDcontent">
      <h1>个人档案详情</h1>
      <hr>
      <h3>基本信息</h3>
      <el-form :model="itemParams" ref="PRDetails">
        <el-row :gutter="24">
          <el-form-item label="姓名:" prop="pname" class="PRD">
            <el-input v-model="itemParams.name" disabled style="width: 180px" />
          </el-form-item>
          <el-form-item label="性别:" prop="sex" class="PRD">
            <el-select v-model="itemParams.sex" placeholder="性别" style="width: 180px" disabled>
              <el-option label="男" value="1" />
              <el-option label="女" value="0" />
            </el-select>
          </el-form-item>
          <el-form-item label="年龄:" prop="age" class="PRD">
            <el-input v-model="itemParams.age" disabled style="width: 180px" />
          </el-form-item>
          <el-form-item label="民族:" prop="volk" class="PRD">
            <el-input v-model="itemParams.volk" disabled style="width: 180px" />
          </el-form-item>
        </el-row>
        <el-row :gutter="24">
          <el-form-item label="联系电话:" prop="telephone" class="PRD">
            <el-input v-model="itemParams.telephone" disabled style="width: 180px" />
          </el-form-item>
          <el-form-item label="身份证号:" prop="idcard" class="PRD">
            <el-input v-model="itemParams.idcard" disabled style="width: 180px" />
          </el-form-item>
          <el-form-item label="出生日期:" prop="borthday" class="PRD">
            <el-input v-model="itemParams.borthday" disabled style="width: 180px" />
          </el-form-item>
          <el-form-item label="婚姻关系:" prop="maritalrelation" class="PRD">
            <el-input v-model="itemParams.maritalrelation" disabled style="width: 180px" />
          </el-form-item>
        </el-row>
        <el-row :gutter="24">
          <el-form-item label="家庭代码:" prop="familycode" class="PRD">
            <el-input v-model="itemParams.familycode" disabled style="width: 180px" />
          </el-form-item>
          <el-form-item label="与户主关系:" prop="relation" class="PRD">
            <el-input v-model="itemParams.relation" disabled style="width: 180px" />
          </el-form-item>
          <el-form-item label="村委会:" prop="village" class="PRD">
            <el-input v-model="itemParams.village" disabled style="width: 180px" />
          </el-form-item>
          <el-form-item label="住址:" prop="address" class="PRD">
            <el-input v-model="itemParams.address" disabled style="width: 180px" />
          </el-form-item>
        </el-row>
      </el-form>
      <hr />
      <h3>病历信息</h3>
      <el-table :data="caseHistoriesList" style="width: 100%">
        <el-table-column prop="cid" label="病历编号" />
        <el-table-column prop="cname" label="姓名" />
        <el-table-column prop="vresult" label="诊断结果" />
        <el-table-column prop="vtime" label="就诊时间" />
      </el-table>
    </div>
  </div>
</template>
<script>
import { recordDetail, recordPerDetailsCaseHistories } from "@/api/record";
export default {
  data() {
    return {
      itemParams: {},
      queryParams: {},
      caseHistoriesList: [],
    };
  },
  created() {
    this.paramIdCard = this.$route.query.idcard;
    this.queryRecordByIdCard();
    this.queryCaseHistoriesByIdCard();
  },
  methods: {
    queryRecordByIdCard() {
      recordDetail({ idcard: this.paramIdCard }).then((res) => {
        this.itemParams = res.data.data[0];
      });
    },
    queryCaseHistoriesByIdCard() {
      this.queryParams.idcard = this.paramIdCard
      recordPerDetailsCaseHistories(this.queryParams).then((res) => {
        this.caseHistoriesList = res.data.data;
        console.log(this.caseHistoriesList);
      })
    }
  },
};
</script>
<style>
.PRD .el-form-item__label {
  width: 100px;
}
</style>
<style scoped>
.PRDcontent h1 {
  font-weight: 600;
  font-size: 25px;
  padding: 10px;
}

.PRDall {
  width: 100%;
  height: 78vh;
  display: flex;
  justify-content: center;
  background-color: white;
}

.PRDcontent {
  width: 80%;
  height: 100%;
  padding-left: 15px;
  overflow: hidden;
  border: 1px solid black;
}
</style>
